{include file="common/header"/}

<body class="bg-light">
	<div class="container">
		<div class="col-md-4 offset-md-4 mt-md-3">
			<div class="card">
				<div class="card-body" >
			    	<h4 class="card-title">注册</h4>
			    	<hr>
			    	<form id="register_form">
						<div class="form-group">
							<label for="register_username">用户名</label>
	          				<input type="text" class="form-control" id="register_username" placeholder="请输入用户名">
	          				<div id="register_username_feedback" class="invalid-feedback"><small></small></div>
						</div>
						<div class="form-group">
							<label for="register_password">密码</label>
				          	<input type="password" class="form-control" id="register_password" placeholder="请输入密码">
				          	<div id="register_password_feedback" class="invalid-feedback"><small></small></div>
				        </div>
				        <div class="form-group">
							<label for="register_fullname">真实姓名</label>
				          	<input type="text" class="form-control" id="register_fullname" placeholder="请输入真实姓名">
				          	<div id="register_fullname_feedback" class="invalid-feedback"><small></small></div>
				        </div>
				        <div class="form-group">
					      <label for="tutor_teacher">辅导老师</label>
					      <select id="tutor_teacher" class="form-control">
					      	{foreach $teachers as $teacher}
					        <option value="{$teacher.tid}">{$teacher.name}</option>
							{/foreach}
					      </select>
					    </div>
						<div class="form-group mt-4">
							<button class="btn btn-primary btn-block" type="submit">立即注册</button>
						</div>
					</form>
			  	</div>
			</div>
		</div>
	</div>
</body>

<script type="text/javascript">
	$(function () {
		$('#register_username').blur(check_username);
		function check_username() {
			var username_value = $('#register_username').val();
			var username_regular_1 = /^[a-zA-Z0-9_]{4,16}$/;
			var username_regular_2 = /\D/;
			var verify = username_regular_1.test(username_value) && username_regular_2.test(username_value);

			if(username_value == '') {
				$('#register_username_feedback').html('用户名不能为空');
				$('#register_username').addClass('is-invalid');
				return false;
			}
			else if (!verify) {
				$('#register_username_feedback').html('用户名必须为4-16个字符的变量名');
				$('#register_username').addClass('is-invalid');
				return false;
			}
			else {
				$('#register_username').removeClass('is-invalid');
				$('#register_username').addClass('is-valid');
				return true;
			}
		}

		$('#register_password').blur(check_password);
		function check_password() {
			var password_value = $('#register_password').val();
			var password_regular = /(?=.*([a-zA-Z].*))(?=.*[0-9].*)[a-zA-Z0-9-*/+.~!@#$%^&*()]{4,20}$/;
			var verify = password_regular.test(password_value);

			if (password_value == '') {
				$('#register_password_feedback').html('密码不能为空');
				$('#register_password').addClass('is-invalid');
				return false;
			}
			else if (!verify) {
				$('#register_password_feedback').html('密码至少包含字母和数字，可以有符号，长度为4-20个字符');
				$('#register_password').addClass('is-invalid');
				return false;
			}
			else {
				$('#register_password').removeClass('is-invalid');
				$('#register_password').addClass('is-valid');
				return true;
			}
		}
		$('#register_fullname').blur(check_fullname);
		function check_fullname() {
			var fullname_value = $('#register_fullname').val();
			var fullname_regular = /^[\u4E00-\u9FA5\uf900-\ufa2d·s]{2,5}$/;
			var verify = fullname_regular.test(fullname_value);
			if (fullname_value == '') {
				$('#register_fullname_feedback').html('姓名不能为空');
				$('#register_fullname').addClass('is-invalid');
				return false;
			}
			else if (!verify) {
				$('#register_fullname_feedback').html('请输入正确姓名');
				$('#register_fullname').addClass('is-invalid');
				return false;
			}
			else {
				$('#register_fullname').removeClass('is-invalid');
				$('#register_fullname').addClass('is-valid');
				return true;
			}
		}

    	$("#register_form").submit(function(event){
    		event.preventDefault();
      		var is_username_valid = check_username();
    		var is_password_valid = check_password();
    		var is_fullname_valid = check_fullname();
      		if (is_username_valid && is_password_valid && is_fullname_valid) {
      			var username = $('#register_username').val();
      			var password = $('#register_password').val();
      			var fullname = $('#register_fullname').val();
      			var tid = $('#tutor_teacher').val();
      			$.post("/index/register/register", {
	      			'username': username,
	      			'password': password,
	      			'fullname': fullname,
	      			'tid': tid
	      		}, 
	      		function(result){
	      			if (result.status == 'success') {
	      				toastr.success(result.message);
	      				setTimeout(function(){
	      					$(location).attr('href', result.data);
						}, 2000);	
	      			}
	      			if (result.status == 'error') {
	      				toastr.error(result.message);
	      			}	      			
	      		}, "json");
      		}
      		else {
      			
      		}      		
  		});
    });
</script>